﻿@using System.Configuration
@using System.Web.Script.Serialization
@using DataMongo
@using MVCMongo.Services
@model MVCMongo.ViewModel.FeedListViewModel

@{
    ViewBag.Title = "Breaking Hub";
    var serializer = new JavaScriptSerializer();
    var configUrl = ConfigurationManager.AppSettings["ImageLinkUrl"];
    Layout = "~/Views/Shared/_LayoutBreakingHome.cshtml";
}



<div class="row-fluid">
    <div class="span12">
        <div class="box box-color box-bordered">
            <div class="box-content nopadding feedcontainer">
                <div class="highlight-toolbar">
                    <div class="pull-left">
                        <div class="btn-toolbar">
                        </div>
                    </div>
                    <div class="pull-right">
                        <div class="btn-group">
                            <span>Showing results <strong>1-25</strong> of <strong>348</strong></span>
                        </div>
                    </div>
                </div>
                <div class="search-results">

                    <ul data-bind="foreach: posts">

                        <li>
                            <div class="thumbnail">
                                <a data-bind="attr: { href: LinkUrl }" class="hover-effect" target="_blank"><img data-bind="attr: { src: Imageurl }" height="100px" width="80px" /></a>
                            </div>
                            <div class="search-info">
                                <a data-bind="attr: { href: LinkUrl }" target="_blank" style="padding-right: 10px"><span data-bind="text:Title"></span></a>
                                <p class="url" data-bind="text:SourceId"></p>
                                <p class="feeddescription" data-bind="html:ShortDescription"></p>

                            </div>

                            <div class="postFooter" style="padding-left: 53px">
                                <input type="hidden" data-bind="value:FeedId" class="FeedId" />

                                <a class="linkPost" href="javascript:void(0)" data-bind="text:LikeOrUnlike"></a>&nbsp;&nbsp; <a class="commentcount" href="#" data-bind="text:CommentCount"></a> &nbsp;&nbsp;<span class="timeago"></span>
                                <span>
                                      <a data-bind="attr: { href: FbShareLink }" class="icon-facebook-sign" style="font-size: 15px"></a>
                                    <a data-bind="attr: { href: TwitterShareLink }" class="icon-twitter-sign" style="font-size: 15px"></a>
                                </span>
                                <div class="clearfix"></div>
                                <p style="padding-bottom: 10px; height: 8px;" class="likeHolder" data-bind="text:LikeCount">
                                </p>
                                @if (Request.IsAuthenticated)
                                {
                                    <div class="commentSection">
                                        <ul data-bind="foreach: PostComments">
                                            <li class="commentHolder">
                                                <img data-bind="attr: { src: CommentedByAvatar }" height="50px" width="50px" style="float: left"><p><a data-bind="text: CommentedBy" style="padding-left: 10px"></a>: <span data-bind="    html: Description"></span></p>
                                                <div class="commentFooter"> <span class="timeago" data-bind="text: CommentedOn" style="padding-left: 10px"></span>&nbsp;</div>
                                            </li>
                                        </ul>
                                        <div style="display: block; padding-top: 10px;" class="publishComment">
                                            <textarea class="commentTextArea" data-bind="value: newCommentMessage, jqAutoresize: {}" placeholder="write a comment..."></textarea>
                                            <input type="button" value="Comment" class="btnComment" data-bind="click: addComment" />
                                        </div>
                                    </div>
                                }

                            </div>
                        </li>

                    </ul>


                </div>
                <div class="highlight-toolbar bottom">
                    <div class="pull-left">
                        <div class="btn-toolbar">
                            @*<div class="btn-group">
                                    <div class="pagination pagination-custom">
                                        <ul>
                                            <li><a href="#"><i class="icon-double-angle-left"></i></a></li>
                                            <li><a href="#">1</a></li>
                                            <li class='active'><a href="#">2</a></li>
                                            <li><a href="#">3</a></li>
                                            <li><a href="#">4</a></li>
                                            <li><a href="#">5</a></li>

                                        </ul>
                                    </div>
                                </div>*@
                            @*<div class="btn-group">
                                    <div class="dropdown">
                                        <a href="#" class="btn" data-toggle="dropdown" rel="tooltip" title="Sort">Sort by <span class="caret"></span></a>
                                        <ul class="dropdown-menu">
                                            <li><a href="#">Name</a></li>
                                            <li><a href="#">Date</a></li>
                                            <li><a href="#">Relevance</a></li>
                                        </ul>
                                    </div>
                                </div>*@
                        </div>
                    </div>
                    <div class="pull-right">
                        <div class="btn-group">
                            <span>Showing results <strong>1-25</strong> of <strong>348</strong></span>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

@*<div class="wrapper">

        <div class="main-content">
            <!-- BEGIN .main-page -->
            <div class="main-page left">
                <!-- BEGIN .double-block -->
                <div class="double-block">

                    <!-- BEGIN .content-block -->
                    <div class="content-block main right">


                        <div class="block">
                            <div class="block-title">
                                <a href="@Url.RouteUrl("AllFeed")" class="right">View All</a>
                                <h2>Recent Break</h2>
                            </div>
                            <div class="block-content">
                                <ul class="article-block-big">
                                    @foreach (var item in Model.FeedList)
                                    {

                                        var imageUrl = configUrl + item.ImageURL1;


                                        <li>
                                            <div class="article-photo">
                                                <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" class="hover-effect" target="_blank"><img src="@imageUrl" alt="@item.Title" /></a>
                                            </div>
                                            <div class="article-content">
                                                <h4>
                                                    <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank" style="padding-right: 10px">@item.Title</a>

                                                    <a class="custom-soc icon-text" href="@UtilityService.GetFacebookShareLink(item.FeedPostId)"></a>

                                                    <a class="custom-soc icon-text" href="@UtilityService.GettwitterShareLink(item.FeedPostId)"></a>

                                                    <a class="h-comment" href="@Url.Action("FeedComment", "Home", new { feedId = item.FeedPostId})">@UtilityService.GetCommentCount(item.FeedPostId)</a>

                                                </h4>
                                                <span class="meta">
                                                    <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank"><span class="icon-text">&#128340;</span>@item.PublishDate.Substring(0,16)</a>
                                                </span>
                                            </div>
                                        </li>
                                    }
                                </ul>
                            </div>
                        </div>

                        <div class="block">
                            <div class="block-title">
                                <a href="category.html" class="right"></a>
                                <h2>Most Break Stories</h2>
                            </div>
                            <div class="block-content">

                                <div class="paragraph-row">

                                    <!-- BEGIN .column6 -->
                                    <div class="column6">
                                        <ul class="article-block">
                                            @foreach (var item in Model.FeedList.OrderByDescending(x => x.FeedPostId).Take(5))
                                            {
                                                var imageUrl = configUrl + item.ImageURL1;
                                                <li>
                                                    <div class="article-photo">
                                                        <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" class="hover-effect" target="_blank"><img src="@imageUrl" width="59px" height="42px" alt="" /></a>
                                                    </div>
                                                    <div class="article-content">
                                                        <h4><a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank">@item.Title</a><a class="h-comment" href="@Url.Action("FeedComment", "Home", new { feedId = item.FeedPostId})">@UtilityService.GetCommentCount(item.FeedPostId)</a></h4>
                                                        <span class="meta">
                                                            <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank"><span class="icon-text">&#128340;</span>@item.PublishDate.Substring(0, 16)</a>
                                                        </span>
                                                    </div>
                                                </li>
                                            }
                                        </ul>
                                        <!-- END .column6 -->
                                    </div>

                                    <!-- BEGIN .column6 -->
                                    <div class="column6">
                                        <ul class="article-block">
                                            @foreach (var item in Model.FeedList.OrderBy(x => x.FeedPostId).Take(5))
                                            {
                                                var imageUrl = configUrl + item.ImageURL1;
                                                <li>
                                                    <div class="article-photo">
                                                        <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" class="hover-effect" target="_blank"><img src="@imageUrl" width="59px" height="42px" alt="" /></a>
                                                    </div>
                                                    <div class="article-content">
                                                        <h4><a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank">@item.Title</a><a class="h-comment" href="@Url.Action("FeedComment", "Home", new { feedId = item.FeedPostId})">@UtilityService.GetCommentCount(item.FeedPostId)</a></h4>
                                                        <span class="meta">
                                                            <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank"><span class="icon-text">&#128340;</span>@item.PublishDate.Substring(0, 16)</a>
                                                        </span>
                                                    </div>
                                                </li>
                                            }

                                        </ul>
                                        <!-- END .column6 -->
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="block">
                            <div class="block-title" style="background: #2182b4;">
                                <a href="#" class="right"></a>
                                <h2>Up-Coming Break</h2>
                            </div>
                            <div class="block-content">

                                <div class="paragraph-row">

                                    <!-- BEGIN .column6 -->
                                    <div class="column6">
                                        <ul class="article-block">
                                            @foreach (var item in Model.UpComingFeedList.OrderByDescending(x => x.FeedPostId).Take(5))
                                            {
                                                var imageUrl = configUrl + item.ImageURL1;
                                                <li>
                                                    <div class="article-photo">
                                                        <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" class="hover-effect" target="_blank"><img src="@imageUrl" width="59px" height="42px" alt="" /></a>
                                                    </div>
                                                    <div class="article-content">
                                                        <h4><a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank">@item.Title</a><a class="h-comment" href="@Url.Action("FeedComment", "Home", new { feedId = item.FeedPostId})">@UtilityService.GetCommentCount(item.FeedPostId)</a></h4>
                                                        <span class="meta">
                                                            <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank"><span class="icon-text">&#128340;</span>@item.PublishDate.Substring(0, 16)</a>
                                                        </span>
                                                    </div>
                                                </li>
                                            }
                                        </ul>
                                        <!-- END .column6 -->
                                    </div>

                                    <!-- BEGIN .column6 -->
                                    <div class="column6">
                                        <ul class="article-block">
                                            @foreach (var item in Model.UpComingFeedList.OrderBy(x => x.FeedPostId).Take(5))
                                            {
                                                var imageUrl = configUrl + item.ImageURL1;
                                                <li>
                                                    <div class="article-photo">
                                                        <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" class="hover-effect" target="_blank"><img src="@imageUrl" width="59px" height="42px" alt="" /></a>
                                                    </div>
                                                    <div class="article-content">
                                                        <h4><a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank">@item.Title</a><a class="h-comment" href="@Url.Action("FeedComment", "Home", new { feedId = item.FeedPostId})">@UtilityService.GetCommentCount(item.FeedPostId)</a></h4>
                                                        <span class="meta">
                                                            <a href="@Url.RouteUrl("ViewFeed", new { id = item.FeedPostId, title = UtilityService.RemoveSpecialCharacters(item.Title) })" target="_blank"><span class="icon-text">&#128340;</span>@item.PublishDate.Substring(0, 16)</a>
                                                        </span>
                                                    </div>
                                                </li>
                                            }
                                        </ul>
                                        <!-- END .column6 -->
                                    </div>
                                </div>
                            </div>
                        </div>

                        <div class="block">
                            <div class="banner">
                                <a href="#" target="_blank"><img src="../../images/no-banner-468x60.jpg" alt="" /></a>
                                <a href="comments.html" class="ad-link"><span class="icon-text">&#9652;</span>Advertisement<span class="icon-text">&#9652;</span></a>
                            </div>
                        </div>
                        <!-- END .content-block -->
                    </div>

                    <!-- BEGIN .content-block -->
                    <div class="content-block left">

                    </div>
                    <!-- END .double-block -->
                </div>
                <!-- END .main-page -->
            </div>

            <!-- BEGIN .main-sidebar -->
            <div class="main-sidebar right">




            </div>
            <div class="clear-float"></div>
        </div>

        <!-- END .wrapper -->
    </div>*@

<script type="text/javascript">

    function clearJumpTags() {
        var list = document.querySelectorAll(".jumpTag");
        var virallist = document.querySelectorAll(".mf-viral");
        var anchortaglist = document.querySelectorAll(".feeddescription a");
        var breaktaglist = document.querySelectorAll(".feeddescription br");
        var imgtaglist = document.querySelectorAll(".feeddescription img");
        $.each(breaktaglist, function () {
            $(this).remove();
        });

        $.each(imgtaglist, function () {
            $(this).remove();
        });

        $.each(virallist, function () {
            $(this).remove();
        });

        $.each(anchortaglist, function () {
            $(this).remove();
        });
        $.each(list, function () {
            $(this).remove();
        });
        $.unblockUI();

        $(".Website").closest("li").addClass("active");

    };

    function popup_share(url, width, height) {
        day = new Date();
        id = day.getTime();
        eval("page" + id + " = window.open(url, '" + id + "', 'toolbar=0,scrollbars=1,location=1,statusbar=0,menubar=0,resizable=0,width=" + width + ", height=" + height + ", left = 363, top = 144');");
    }

    $(".btnComment").live("click", function () {
        var countText = $(this).closest(".postFooter").find(".commentcount").text();
        var splitdata = countText.split("(")[1].split(")")[0];
        var count = parseInt(splitdata) + 1;
        $(this).closest(".postFooter").find(".commentcount").text("Comment ( " + count + " )");
    });

</script>



<style>
    .search-results .commentSection ul li:nth-child(2n) {
        background: none repeat scroll 0 0 #EEF1F6;
    }
</style>

<script type="text/javascript">
    var feedtype = @serializer.Serialize(7);
    var CategoryId = @serializer.Serialize(0);

    $(".linkPost").live("click", function() {
        var value = $(this).text();
        var element = $(this).closest(".postFooter");
        var feedId = element.find(".FeedId").val();
        var url = '';
        if (value == "Like") {
            url = '/Home/FeedLike?feedId=' + feedId;
        } else {
            url = '/Home/FeedUnlike?feedId=' + feedId;
        }

        $.getJSON(url, function(data) {
            if (data.authenticated == "false") {
                alert("Please sign in to like this feed.");
            } else {
                element.find('.likeHolder').text(data.feedlike);

                element.find('.linkPost').text(data.text);
            }


        });
    });


</script>

<script src="~/Scripts/jquery.autosize-min.js"></script>
<script src="~/Scripts/jquery.timeago.js"></script>
<script src="~/Scripts/knockout-2.2.0.js"></script>
<script src="~/Scripts/HomeFeed.js"></script>